import React, {Fragment, useState,useEffect,useLayoutEffect} from 'react';
import {CTable} from "@/components/boncGpt/RobotRes/Ctable";
import styles from "./index.less";
import Sql from "@/components/boncGpt/RobotRes/Sql";
import ZanOrCai from "@/pages/NewTalk/zanOrCai";
import {cloneDeep} from "lodash";
import {connect} from "@@/plugin-dva/exports";

const PreSearchCom = ({ itemContent,onOk,exportDown,dispatch,handleScroll,bottomScroll,dialogFlag }) => {
  const [item, setItem] = useState({});
  const [stop, setStop] = useState(false);
  const [kpiSql, setKpiSql] = useState(false);
  const [finalSql, setFinalSql] = useState(false);
  const [vtableSql, setVtableSql] = useState(false);
  const [aiSql, setAiSql] = useState(false);
  const [detail, setDetail] = useState(false);
  const [scrollStatus, setScrollStatus] = useState(0);
  useEffect(() => {
    setItem(cloneDeep(itemContent))
    // setStop(false)
  }, [itemContent]);
   function exportData(){
     exportDown(item.resp)
  }
  function postOk(){
     onOk(item)
  }
  function changeScrollStatus(type){
     if(type){
       setScrollStatus(scrollStatus+1)
     }else {
       setScrollStatus(0)
     }
  }
  function changeStatus(status){
    setStop(status)
    if(!status){
      if(itemContent.resp.resp_code==="00006"){
          setKpiSql(true)
          setFinalSql(true)
          setVtableSql(true)
        if(!itemContent?.resp?.ai_sql){
          setAiSql(true)
        }else {
          setAiSql(false)
        }
      }else {
        if(!itemContent?.resp?.kpi_sql){
          setKpiSql(true)
        }else {
          setKpiSql(false)
        }
        if(!itemContent?.resp?.final_kpi_sql){
          setFinalSql(true)
        }else {
          setFinalSql(false)
        }
        if(!itemContent?.resp?.vtable_sql){
          setVtableSql(true)
        }else {
          setVtableSql(false)
        }
        if(!itemContent?.resp?.ai_sql){
          setAiSql(true)
        }else {
          setAiSql(false)
        }
      }

      setItem({...itemContent,
        resp:{
          kpi_sql:null,
          final_kpi_sql:null,
          vtable_sql:null,
          ai_sql:null
        }
      })
      //暂时注释掉
      // changeScrollStatus()
      setTimeout(()=>{
        setItem(cloneDeep(itemContent))
      },500)

    }
  }
  function listenScroll(e){
     if(e.deltaY<0){
       setScrollStatus(5)
     }
  }
  useEffect(()=>{
    const handleScroll = (e) => listenScroll(e);
    //监听滚动事件未生效 需要打印看看怎么回事
    window.addEventListener("wheel", handleScroll)
    return ()=>window.removeEventListener("wheel", listenScroll)
  },[])
  useEffect(() => {
    if(itemContent.resp.resp_code==="00006"){
      setKpiSql(true)
      setFinalSql(true)
      setVtableSql(true)
      if(!itemContent?.resp?.ai_sql){
        setAiSql(true)
      }
    }else {
      if(!itemContent?.resp?.kpi_sql){
        setKpiSql(true)
      }
      if(!itemContent?.resp?.final_kpi_sql){
        setFinalSql(true)
      }
      if(!itemContent?.resp?.vtable_sql){
        setVtableSql(true)
      }
        setAiSql(true)
    }

  }, []);
  useEffect(() => {
    if(!bottomScroll){
      setScrollStatus(0)
    }
  }, [bottomScroll]);
   function getStatus(name,type){
     if(type){
         setStop(false)
       setDetail(true)
     }else {
       setDetail(false)
       if(name==="kpiSql"){
         setKpiSql(true)
       }else if(name==="finalSql"){
         setFinalSql(true)
       }else if(name==="vtableSql"){
         setVtableSql(true)
       }else if(name==="aiSql"){
         setAiSql(true)
       }
     }
   }
   function update(){
     handleScroll()
   }
   useEffect(()=>{
     if(kpiSql&&finalSql&&vtableSql&&aiSql&&!detail){
       setStop(true)
     }
   },[kpiSql,finalSql,vtableSql,aiSql,detail])
   if(item.resp){
     return <Fragment>
       {item.resp.resp_code == "00005" ? (<div>
           <div style={{marginBottom: "10px"}}>{item.resp.kpi_name + ":"}</div>
           <div style={{marginBottom: "10px"}}>{"结果数据如下"+ ":"}<span onClick={exportData} style={{color:"#1067ee",textDecoration:"underline",cursor:"pointer"}}>下载数据表</span></div>
           <CTable table={item.resp.input} columns={item.resp.input_column}/></div>) :
         (<div className={styles.response}>
           <div>{dialogFlag==="0"?"指标名称：":""}{item.resp.kpi_name}</div>
           {item.resp.kpi_sql &&item.resp.resp_code !== "00006"&&
             <div>指标SQL：
               <Sql scrollStatus={scrollStatus} changeScrollStatus={changeScrollStatus} handleScroll={update} name={"kpiSql"} stop={stop} sql={item.resp.kpi_sql} getStatus={getStatus}/>
             </div>}
           {item.resp.final_kpi_sql && kpiSql&&item.resp.resp_code !== "00006"&&
             <div>指标完整加工SQL：
               <Sql scrollStatus={scrollStatus} changeScrollStatus={changeScrollStatus}  handleScroll={update} name={"finalSql"} stop={stop} sql={item.resp.final_kpi_sql} getStatus={getStatus}/>
             </div>}
           {item.resp.vtable_sql &&finalSql&&kpiSql&&item.resp.resp_code !== "00006"&&
             <div>虚拟宽表SQL：
               <Sql scrollStatus={scrollStatus} changeScrollStatus={changeScrollStatus}  handleScroll={update} name={"vtableSql"} stop={stop} sql={item.resp.vtable_sql} getStatus={getStatus}/>
             </div>}
           {item.resp.ai_sql &&finalSql&&kpiSql&&vtableSql&&item.resp.resp_code === "00006"&&
             <div>
               <Sql scrollStatus={scrollStatus} changeScrollStatus={changeScrollStatus}  handleScroll={update} name={"aiSql"} stop={stop} sql={item.resp.ai_sql} getStatus={getStatus}/>
             </div>}
           {!item.codeInformation&&(item.resp.kpi_sql||item.resp.final_kpi_sql||item.resp.vtable_sql||item.resp.ai_sql||item.resp.resp_code === "00003") ? (<div style={{textAlign: 'right'}}>
             <div className={styles.getDataBtn}><span onClick={postOk}>{"点我进行数据生成" + ">>>"}</span></div>
           </div>) : ""}
         </div>)}
       <ZanOrCai index={item.index} islike={item.islike} resp={item.resp} question={item.question}
                 predictStatus={item.predictStatus} createTime={item.createTime}
                 changeStatus={changeStatus}
                 stop={stop}
                 dispatch={dispatch} />
     </Fragment>
   }else {
     return <div></div>
   }


};

export default connect(({intellectAssistant}) => ({
  dialogFlag: intellectAssistant.dialogFlag,
}))(PreSearchCom);
